import React, { Component } from 'react';
import { connect } from 'dva';

// import { formatMessage, FormattedMessage } from 'umi/locale';
// import GridContent from '@/components/PageHeaderWrapper/GridContent';
import classNames from 'classnames';
import { Table } from 'antd';

import styles from './Message.less';
// @connect(({ chart, loading }) => ({
//   chart,
//   loading: loading.effects['chart/fetch'],
// }))
const { Column, ColumnGroup } = Table;

const columns = [
  {
    title: '消息标题',
    dataIndex: 'newsTitle',
    key: 'newsTitle',
    render: text => <a href="#">{text}</a>,
  },
  {
    title: '时间',
    dataIndex: 'date',
    key: 'date',
  },
];

@connect(({ message }) => ({
  newslist: message.newslist,
}))
class Message extends Component {
  constructor(props) {
    super(props);
  }

  state = {
    page_num: 1,
    page_size: 10,
    newslist: [],
  };

  componentDidMount() {
    const { dispatch } = this.props;

    dispatch({
      type: 'message/getMessageData',
      payload: {
        page_num: this.state.page_num,
        page_size: this.state.page_size,
      },
    });
  }

  render() {
    const { newslist } = this.props;
    console.log('newslist', newslist);

    return (
      // <Layout>
      <div style={{ padding: '24px 24px 0' }}>
        {/* 消息列表 */}
        <div className={classNames(styles.RowMargin, styles.shadow)}>
          <div className="titleLine">
            <div className="kk" />
            消息列表
          </div>
          <div className={styles.newBox}>
            <Table columns={columns} dataSource={this.state.newslist} />
            {/* { this.state.newslist === {} ? '暂无消息' : <Table columns={columns} dataSource={newslist} /> } */}
          </div>
        </div>
      </div>
      // </Layout>
    );
  }
}
// export default Message;
const mapStateToProps = state => ({
  newslist: state.message.newslist,
});
export default connect(mapStateToProps)(Message);
